<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<!--    <link rel="stylesheet" href="../../static/lib/layui-v2.6.3/css/layui.css" media="all">-->
    <link th:href="@{../static/lib/layui-v2.6.3/css/layui.css}" rel="stylesheet">
    <link th:href="@{../static/dtree/dtree.css}" rel="stylesheet">
    <link th:href="@{../static/dtree/font/dtreefont.css}" rel="stylesheet">
<!--    <link rel="stylesheet" href="../../css/public.css" media="all">-->
    <link th:href="@{../static/css/public.css}" rel="stylesheet">
    <style>
        body {
            background-color: #ffffff;
        }
    </style>
</head>
<body>
<form class="layui-form layuimini-form" lay-filter="editFormFilter">
    <div class="layui-form-item">
        <label class="layui-form-label">菜单配置</label>
        <div style="height: 250px;overflow: auto;" id="toolbarDiv">
            <ul id="demoTree" class="dtree" data-id="0"></ul>
        </div>
    </div>


    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认配置</button>
        </div>
    </div>
</form>
<script src="../static/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script src="../static/dtree/dtree.js"></script>

<!-- 子页面 (child.html) -->
<script>
    layui.config({
        base: '/static/dtree/' //配置 layui 第三方扩展组件存放的基础目录
    }).extend({
        dtree: 'dtree' //定义该组件模块名
    }).use(['form', 'jquery','dtree'], function () {
        var form = layui.form,
            dtree = layui.dtree,
            layer = layui.layer,
            $ = layui.$;
        var queryParams = new URLSearchParams(window.location.search);
        var id = queryParams.get('id');
        // var paramCode = queryParams.get('paramCode');
        // var paramValue = queryParams.get('paramValue');
        console.log(id); // 显示传递的参数值
        // $("#paramCode").val(paramCode);
        // $('[name="paramValue"]').val(paramValue);
        dtree.render({
            elem: "#demoTree",
            // data: "/static/api/init1.json", // 使用data加载
            url: "/role/getRoleById/"+id, // 使用url加载（可与data加载同时存在）
            dataStyle: "layuiStyle",  //使用layui风格的数据格式
            dataFormat: "list",  //配置data的风格为list
            response:{message:"msg",statusCode:0},
            scroll:"#toolbarDiv", // 绑定div元素
            toolbar:true,
            method: "get", //默认为post
            icon: "-1",  //修改二级图标样式
            checkbar: true,
            checkbarType: "all",
            checkbarData: "choose"// choose记录选中（默认）， "change"：记录变更， "all"：记录全部，
        });
        // layer.load(1);
        // $.get('/role/getRoleById',{id:id}, function(a){
        //     console.log(a);
        //     if(a.code == 200){
        //         user = a.data;
        //         // layer.msg('登录成功 - 欢迎用户: ' + user.paramCode , {icon: 1});
                layer.closeAll();
        //         $('[name="name"]').val(user.roleName);
        //         $('[name="description"]').val(user.description);
        //     }else {
        //         layer.closeAll('loading');
        //         layer.msg('登录失败'+a.message, {icon: 2});
        //         return false;
        //     }
        // }).fail(function(){
        //
        //     layer.msg('请求失败，请重试', {icon: 2});
        //     return false;
        // });
        //监听提交
        form.on('submit(saveBtn)', function (data) {
            var result = JSON.stringify(data.field);
            layer.alert(result, {
                title: '添加信息：'
            });
                var params = JSON.stringify(dtree.getCheckbarNodesParam("demoTree"));
                const dataArray = JSON.parse(params);
                const nodeIdList = dataArray.map(item => Number(item.nodeId));
                console.log(nodeIdList)

                $.post('/role/update-role',{id: id, menuList:nodeIdList} , function(res){
                    layer.closeAll();
                    if(res) {  // 直接判断Boolean返回值
                        layer.msg('添加成功 - 用户: ' + data.field.name , {icon: 1});
                        // layer.close(index);// 关闭弹出层
                    } else {
                        layer.msg('添加失败', {icon: 2});
                        // layer.close(index);// 关闭弹出层
                    }
                }).fail(function(){
                    layer.closeAll();
                    layer.msg('请求失败，请重试', {icon: 2});
                    layer.close(index);// 关闭弹出层
                });
            var iframeIndex = parent.layer.getFrameIndex(window.name);
            parent.layer.close(iframeIndex);
             // }

            return false;
        });
        });
</script>
</body>
</html>